import React from 'react'
import cx from 'classnames'
import style from './style.loading'

export default class extends React.Component {

	render() {
		const { height, width, className, loading, value } = this.props
		let styles = {}
		if (height) {
			styles.height = `${height}px`
		}
		if (width) {
			styles.width = `${width}px`
		}
		return (
			<div 
				className={cx({
				[style.root]: true,
				[className]: className
				})}
				style={styles}
			>
        {
          loading? <div className={style.loadingBar}></div>: null
        }
        {
          !loading?
          <div className={style.bar} style={{
            width: `${value}%`
          }}/>: null
        }
			</div>
		)
	}
}
